import React, {Component} from 'react';
import PropTypes from "prop-types"
import "./comment-item.css"

class CommentItem extends Component {
    static propTypes = {
        comment: PropTypes.object.isRequired,
        removeContent: PropTypes.func.isRequired,
        index: PropTypes.number.isRequired
    };
    remove = () => {
        const {comment, removeContent, index} = this.props;
        if (window.confirm(`确定删除${comment.username}的评论吗?`)) {
            removeContent(index);
        }
    };

    render() {
        let {comment} = this.props;
        return (
            <li className="list-group-item">
                <div className="handle">
                    <a href="#" onClick={this.remove}>删除</a>
                </div>
                <p className="user"><span>{comment.username}</span><span>说:</span></p>
                <p className="centence">{comment.content}</p>
            </li>
        );
    }
}

export default CommentItem;